<template>
  <div>
    <!-- 下拉菜单的value必须写上 -->
    来自于:
    <select v-model="city">
      <option value="1">广州</option>
      <option value="2">北京</option>
      <option value="3">上海</option>
      <option value="4">深圳</option>
      <option value="5">澳门</option>
    </select>
    <hr />
    <!-- v-model绑定多选框时,有两种情况 -->
    <!-- 1.当vue变量为非数组是,v-model自动绑定checked,而不是value -->
    <!-- 2.当vue变量为数组时,v-model自动绑定value,而不是checked -->
    爱好:
    <input v-model="like" type="checkbox" value="1" />抽烟
    <input v-model="like" type="checkbox" value="2" />喝酒
    <input v-model="like" type="checkbox" value="3" />烫头
    <input v-model="like" type="checkbox" value="4" />女人
    <hr />
    <!-- v-model绑定单选框无特殊规则,不用使用数组 -->
    <!-- 注意:每个表单元素都给value -->
    性别
    <input v-model="gender" type="radio" value="1" />男
    <input v-model="gender" type="radio" value="2" />女
    <hr />
    自我介绍:
    <textarea v-model="intro"></textarea>
  </div>
</template>

<script>
export default {
  data() {
    return {
      city: "",
      intro: "",
      like: ["1"],
      gender: "",
    };
  },
};
</script>

<style>
</style>